<template>
	<view class="login bg">
		<view class="uni-mlr-10" style="padding-top: 60px;">
			<view class="logo uni-center">
				<image class="image" mode="widthFix" style="max-width: 100%;max-height: 100%;" src="/static/logo.png" />
			</view>
			<view class="welcome">欢迎来到行查平台</view>
			<view class="login-form">
				<uni-forms :rules="rules" :modelValue="formData" ref="form">
					<uni-forms-item name="userId">
						<uni-easyinput class="userId" v-model="formData.userId" :styles="styles"
							:placeholderStyle="placeholderStyle" placeholder="请输入ID">
						</uni-easyinput>
					</uni-forms-item>
					<uni-forms-item name="pass">
						<uni-easyinput class="pass" v-model="formData.pass" type="password" :styles="styles"
							:placeholderStyle="placeholderStyle" placeholder="请输入Pass">
						</uni-easyinput>
					</uni-forms-item>
					<view class="remember-psw" style="position: relative;top: -12px; font-size: 28rpx;">
						<checkbox-group @click="rememberPsw = !rememberPsw">
							<checkbox type="checkbox" :checked='rememberPsw' 
								color="#0c6eb7"  style="transform:scale(0.7);margin-top: -3px;" />
							记住账号密码
						</checkbox-group>
					</view>
					<button style="margin-top:10px" class="uni-color-primary" type="primary" @click="formSubmit">登
						录</button>
					<button style="margin-top:20px" class="uni-color-orange" type="default"
						@click="scanCodeLogin">扫一扫快速进入</button>
				</uni-forms>
			</view>
		</view>
		<tfgg-verify ref="verifyElement" @result="verifyResult"></tfgg-verify>
	</view>
</template>

<script>
	import tfggVerfy from "../../components/tfgg-verify/tfgg-verify.vue"
	import {
		mapActions
	} from 'vuex'
	export default {
		components: {
			tfggVerfy
		},
		data() {
			return {
				rememberPsw: true, //复选框状态 默认勾选
				formData: {
					// xnntest   Ll123456
					userId: '',
					pass: '',
					requestCode: ''
				},
				rules: {
					id: {
						rules: [{
							required: true,
							errorMessage: '请输入正确的ID',
						}]
					},
					pass: {
						rules: [{
							required: true,
							errorMessage: '请输入正确的Pass',
						}]
					}
				},
				placeholderStyle: "color:#cddff5;font-size:14px",
				styles: {
					color: '#0c6eb7',
					borderColor: '#fff',
					backgroundColor: '#fff',
					height: '50px',
				}
			}
		},
		mounted() {
			//取出缓存中的账号、密码
			const HBuserId = uni.getStorageSync('HBuserId');
			const HBpassword = uni.getStorageSync('HBpassword');
			// console.log("缓存的账号:", HBuserId)
			// console.log("缓存的密码:", HBpassword)
			//有账号、密码就赋值给文本，没有就清空
			if (HBuserId && HBpassword) {
				this.formData.userId = HBuserId;
				this.formData.pass = HBpassword;
			}
		},
		methods: {
			...mapActions(['mLogin', 'loginByLoginCode']),
			async getRequestCode() {
				await this.$http.post("/requestcode/get", {}).then(res => {
					// console.log(res)
					if (res.data.errcode == 0) {
						this.formData.requestCode = res.data.data.requestCode
					} else {
						uni.showToast({
							title: res.data.errmsg,
							icon: "none"
						})
					}

				})
			},
			formSubmit() {
				this.$refs.form.validate().then(res => {
					console.log('表单数据信息：', res);
					this.$refs.verifyElement.show();
				}).catch(err => {
					console.log('表单错误信息：', err);
				})

			},
			/* 校验结果回调函数 */
			async verifyResult(res) {
				if (res) {
					this.$refs.verifyElement.reset(); //校验成功重置插件
					console.log('验证成功')
					await this.getRequestCode()
					// 测试账号PanLiChun，密码 Kk123456
					let obj = Object.assign({}, this.formData, {
						pass: this.$w_md5.hex_md5_32(this.formData.pass)
					})
					await this.mLogin(obj).then((ress) => {
						console.log("ress", ress)
						if (ress.errcode == 0) {
							//勾选就缓存账号、密码
							if (this.rememberPsw) {
								uni.setStorageSync('HBuserId', this.formData.userId);
								uni.setStorageSync('HBpassword', this.formData.pass);
							} else { //销毁缓存中的账号、密码
								uni.removeStorageSync('HBuserId');
								uni.removeStorageSync('HBpassword');
							}
							uni.showToast({
								title: '登录成功',
								icon: "none"
							})
							// 两种身份进入不同的页面
							if (ress.data.belongGroup && ress.data.belongGroup.length) {
								uni.reLaunch({
									url: './accidentSignList'
								})
							} else {
								uni.reLaunch({
									url: './accidentList'
								})
							}

						} else {
							uni.showToast({
								title: ress.errmsg,
								icon: "none"
							})
						}
					})
				}
				// console.log(res);
			},
			/* 显示校验弹窗 */
			verifyFasong() {
				this.$refs.verifyElement.show();
			},
			/* 校验插件重置 */
			verifyReset() {
				this.$refs.verifyElement.reset();
			},
			// 扫描web上二维码快速登录，进入某一条中
			async scanCodeLogin() {
				let me = this;
				uni.scanCode({
					onlyFromCamera: true,
					scanType: 'qrCode',
					hideAlbum: true,
					success: async function(res) {
						// console.log('条码类型：' + res.scanType);
						console.log('条码内容：' + res.result);
						// loginCode:7yu328ewru238hedj238u2390rudi19u32rf923j|eventId:6tgh9876tghj976tghji976tghjio
						if (res.result.includes('|')) {
							let loginCode = res.result.split('|')[0].split(':')[1]
							let eventId = res.result.split('|')[1].split(':')[1]
							console.log(loginCode, eventId);
							let obj = Object.assign({}, {
								loginCode: loginCode
							})
							await me.loginByLoginCode(obj).then((ress) => {
								console.log("ress", ress)
								if (ress.errcode == 0) {
									uni.showToast({
										title: '登录成功',
										icon: "none"
									})
									// 两种身份进入不同的页面
									if (ress.data.belongGroup && ress.data.belongGroup.length) {
										uni.reLaunch({
											url: './accidentSignList?eventId=' + eventId
										})
									} else {
										uni.reLaunch({
											url: './accidentList?eventId=' + eventId
										})
									}
								} else {
									uni.showToast({
										title: ress.errmsg,
										icon: "none"
									})
								}
							})
						} else {
							res.result.split('|')
							let loginCode = res.result.split(':')[1]
							let obj = Object.assign({}, {
								loginCode: loginCode
							})
							await me.loginByLoginCode(obj).then((ress) => {
								console.log("ress", ress)
								if (ress.errcode == 0) {
									uni.showToast({
										title: '登录成功',
										icon: "none"
									})
									// 两种身份进入不同的页面
									if (ress.data.belongGroup && ress.data.belongGroup.length) {
										uni.reLaunch({
											url: './accidentSignList'
										})
									} else {
										uni.reLaunch({
											url: './accidentList'
										})
									}
								} else {
									uni.showToast({
										title: ress.errmsg,
										icon: "none"
									})
								}
							})
						}

					}
				})
			}
		}
	}
</script>

<style lang="scss">


</style>